﻿.body-panel #app {
    width:100%;
    height:100%;
    display: flex;
    flex-direction: column;
}


#app .body-header {
    width:100%;
    height:100px;
    display:flex;
}

    #app .body-header .greet{
        flex:1;
        text-align:start;
        padding-left:20px;
        font-size:25px;
        font-weight:bold;
        align-content:center;
    }

    #app .body-header .timer{
        flex:1;
        text-align:end;
        padding-right:15px;
        align-content:center;
        font-size:30px;
    }

#app .body-content{
    width:100%;
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
}
    #app .body-content .button-panel{
        width:100%;
        display:flex;
        flex-direction:column;
    }
        #app .body-content .button-panel .title {
            width:100%;
            height:150px;
            align-content:start;
            text-align:center;
            font-size:30px;
        }

        #app .body-content .button-panel .button-container{
            width:100%;
            display:flex;
            gap:5%;
            align-items:center;
            justify-content:center;
        }

        #app .body-content .button-panel .button-container .button{
            width:150px;
            height:150px;
            border-radius:10px;
            color:white;
            position:relative;
            display:flex;
            flex-direction:column;
            align-items:center;
            justify-content:center;
            gap:10%;
        }

.button-container .button i{
    font-size:50px;
}
.button-container .button span{
    font-size:20px;
}

.button-container .check-in {
    background-color: #E6A23C;
}

.button-container .cancel {
    background-color: #F56C6C;
}

.button-container .print {
    background-color: #409EFF;
}


.transparent-input {
    background-color: transparent;
    border: none;
    outline: none;
    color: transparent;
    width: 80%;
}

.transparent-input:focus {
    background-color: transparent;
    border: none;
    outline: none;
    box-shadow: none;
}

.


